Henrik Høltzer (heho)
Programmering - PROG 3C

Semester: 3.sem., efterår 2021
Email: heho@zealand.dk

 

Uge Emner Materialer Opgaver
34

Introduktion til kurset
rust-fjerner bl.a. Unit test

Begrebs-kort.

Microsoft Visual Studio Docs:
Unit test basics

Walkthrough: Create and run unit tests for managed code
Use code coverage to determine how much code is being tested

Unit Testing (Power point)

Begrebs-kort (Power point)

Har du den nødvendige software:

Læs og afprøv følgende tutorials:
Walkthrough: Create and run unit tests for managed code

Use code coverage to determine how much code is being tested

Bemærk: For at benytte code covarage i VS2019 med Bank eksemplet , højreklik på 'BankTest" i "Test Explorer" og kør "Analyze Code Covarage for Selected Test"

 

Gennemgå og diskuter parvist følgende eksempler: 
TryingUnitTesting
 | Animal farm | Zoo | TeacherLibrary

Løs opgaven:
Brush Up: Student + Test + Documentation 

Extra: Hackerrank.com Programmerings-konkurrencer osv etc

35

Component + unit test

SoftwareComponents.pptx

Microsoft .Net Core Guide:
Build a .NET Standard library with C# and the .NET Core SDK in ...
Test a .NET Standard library with .NET Core in ...

 

Læs og afprøv følgende tutorials:
Build a .NET Standard library with C# and the .NET Core SDK in ...
Test a .NET Standard library with .NET Core in ...

Calculator Part1 (.Net Standard library)
Calculator Part2 (program/applikation)

36

JavaScript

JavaScript
http://www.w3schools.com/js/default.asp
 (læs det hurtigt - ikke alt er vigtigt)
Vi bruger Vue.js så document.getElementById(...) er sjældent nødvendigt for os.

Linkedin/learning (ekstra):
Morten Rand-Hendriksen: JavaScript Essential Training (video)
(Giver en udførlig gennemgang af JavaScript, skip "Linting and formatting" i første omgang)



Examples (Code demonstated in the class):

ES2015Test (VSCode)
JavaScriptObjects (VSCode)



Exercise:

Hvis JavaScript er helt "nyt" for dig kan du lave føglende exercises i Codecademy:
Codecademy: https://www.codecademy.com/learn/introduction-to-javascript

37 Vue.js

Er din webside mobilvenlig? er min?

Vue3 intro (slides)

Vue Mastery: Intro to Vue.js (video)
Vuejs.org: Vue Introduction

Vue Essentials Cheat Sheet, specielt side 1
Vue3 CheatSheet for developers

Bemærk:
Fredag d. 17/9 kl. 14.00: Hackathon start
Hackathon kører hele weekenden hos GroupM , Holmblandsgade Amager
(Frivilig aktivitet)

Obligatorisk studieaktivitet (hjemmeopgave startes)
Obligatorisk opgave 1 (studieaktivitet)


Eksempler
(Kode vist i klassen):

SayHelloVue3
Vue3Examples

Exercise: (Bootstrap + validation)
Bootstrap makeover of an existing web page

Exercise:
(Vue.js)
Gennemgå Intro to Vue.js og løs diverse Challenge

Collect words using JavaScript and Vue.js
Calculator with JavaScript + Vue.js

 

Solution:
Calculator
Collect Words

38

Web-applikationer: UI test med Selenium

JavaScriptScript: DOM manipulation

ON+TO+FR Innodays (særligt forløb om innovation)

Selenium
Unit testing Web applications (Power Point)
SeleniumHQ
Eksempler (Kode vist i klassen):
jsSayHelloVue3-master (VSCode) | HelloAppTest (VS2019)
CalculatorExtended (VSCode) | CalculatorSeleniumTest (VS2019)

Exercise
  1. Download a driver suitable for your browser: Chrome | FireFox
    Unzip the drivers and save them in a folder like c:\webDrivers.
    If your browser updates, you must download a new version of the webdriver (Chrome updates frequently …)
  2. UI testing: Collect Words | solution
  3. UI test for your Calculator web application | solution
    Hint: How to select an option from drop down using Selenium WebDriver C#?


39


JavaScript: Consume REST (Axios),
promises

 

Axios

  1. Sebastian Eschweiler Getting Started with Axios
    This is a JavaScript tutorial. We should convert to TypeScript.
  2. GitHub Axios documentation
  3. Travis Horn Building json2table: Turn JSON into an HTML table
  4. Joy Waguru: Asynchronous Javascript using Async - Await
  5. Extra: GitHub offers a REST API. Try it. How to display the data?

 

Eksempler (Kode vist i klassen):
REST GET example (Vue Posts): JS, Vue, async/await
REST GET, DELETE, POST example (Vue Cars) | REST service provider
General REST consumer (check for CORS availability)
Extra Generic Table


Exercise:

  1. Go through Getting Started with Axios
  2. GET some data from http://jsonplaceholder.typicode.com/todos and show the data in the browser using Vue.js.
    Look at the REST GET example (Posts) for inspiration.
  3. Use the Bookstore REST API to create a web application | solution
    Look at the Cars example for inspiration.
    Hint: First ignore query string parameters provided by the REST controller. Later you can use the query string parameters ...
  4. Push your web application to GitHub.
  5. Upload your web application to Microsoft Azure.
    Use FTP, or use the Kudu console (“Upload files and folder using drag and drop”).
    If your browser complains about mixed content … make sure you request your web-page using http://…., not https://….
  6. Add some Bootstrap styling to one (or more) of your JavaScript + Vue.js applications.
    Make buttons etc look nicer + add some responsiveness (adapt to browser width)
  7. More JavaScript projects: Consume the REST services you made in TEK class.



Første obligatoriske opgave afleveres i wiseflow senest: d 27/9 kl 23.59

40

Selenium UI test fortsat
- Test af WebApps der benytter REST services


Ekstra:

Vue components

Selenium: Explicit and implicit waits

Example: REST GET, DELETE, POST example (Vue Cars) + UITestCarsAsynRest

 

Ekstra:
Getting started with Vue CLI and single-file components in Vue.js, Microsoft

Components Basic, Vue.js.
Stop før afsnittet Emitting a Value With an Event

Example: Vue3ComponentButtonCounter
How-to video om hvordan man uploader fra Visual Code til GitHub.

Make a UI test for your web application - an application consuming a REST service.
Example UI test


Ekstra:

Gennemfør eksemplerne fra Components Basic, Vue.js.
Stop før afsnittet Emitting a Value With an Event
Der er 2 eksempler (button-counter, blog-posts), så lav 2 selvstændige projekter.

41 Ingen UV i Programmering    
42 Efterårsferie  
43

Parprogrammering


A note on pair programming, including remote pair programming.

Visual Studio Live Share
Live Share Extension Pack for Visual Studio Code
Inviting Collaborators to a private repository

Exercise: (Pair programming)

REST + JavaScript from user stories 

44

Tek+Prog - Prøveeksamen (Torsdag 9.00-14.00)

 

 

45
Python, Rasberry Pi, SenseHat


Rasberry Pi SenseHat
Getting started with the SenseHat
Sense Hat API Reference
W3School: Python
Python Quick Guide

Extra: Learn more Python3:
Tutorials Point: Python Tutorial
The Python Tutorial
Python Software Foundation
Guru99: Python Tutorial for Beginners


Examples:
Python + Sense HAT examples
Tamagotchi in the emulator (see: Processing.py)



Exercise: (Pair-programming)
  1. Disco and Christmas lights 
  2. Show temperature, humidity or pressure on the display using (very) simple graphs or digits.
  3. Play with some of the examples from W3Schools Python
  4. Simple Python (no Sense HAT): Download interpreter + write code in Notepad
  5. Extra: Download PyCharm. Same company as ReSharper = same license

Bemærk, hvis du ønsker at benytte PyCharm sammen med din PI (kan absolut godt anbefales!!) skal du benytte en remote connection, se: https://www.hackster.io/Jolley71717/connect-jetbrains-pycharm-to-raspberry-pi-72be15
Opret en ny mappe på din PI ala HEHO, den kommer til at ligge under: /home/pi/HEHO. Denne sti benyttes til "remote project location"

46

IoT: begrebet, Raspberry Pi, Putty, Linux
IoT: UDP fra Python

  1. Wikipedia: Internet of Things
  2. Lopez Research An Introduction to the Internet of Things, 2013
  3. Libelium: 50 Sensor Applications for a Smarter World
  4. Introduction to Lora
  5. Internet of Things (slides)

Exercise:

  1. Download and install Putty (Putty.exe)
    Putty will enable you to communicate from your laptop to Raspberry Pi: Use the laptop keyboard + screen with the Pi.
    Use the IP address printed at the bottom of the Raspberry Pi
  2. Download and install WinSCP

With WinSCP you can easily move files from Raspberry Pi to your laptop (and vice versa)

  1. Sensing the environment 
  2. Ball control | solution (joystick) + solution (orientation)
  3. Show the Pi’s IP address on the LED display
  4. Read data and send UDP broardcast
  5. Use the emulator to program Python

 

 

 

47-49 Projektarbejde
FR 14:00 code freeze
   
50

Prøve-eksamen PROG+TEK
Torsdag kl 9-13++.

Prøve-eksamen er en af de obligatoriske studie-aktiviteter jf. Studieordningen

 
 

Spørgetime (fredag d. 7. jan kl.10.00 - ca. 12 på Teams)
PROG+TEK eksamen (11-14. januar)
PROG+TEK reeksamen (fredag d. 28. januar)

Pensumliste